<!-- #INCLUDE FILE="config.asp" -->
<form action="<%=CandidateProfileMgr %>Login.aspx" method="post" onsubmit="return validateForm();"
    target="CandidateProfileMgr" name="loginForm">
    <div id="divForm">
        <div id="divLoading" style="display: none;">
            <span id="txtLoading">Connecting to server.</span>
        </div>
        <div id="divLogin" style="display: none;">
            <div class="A05">
                <h3>
                    <strong>Candidate Login</strong></h3>
                <div class="description" style="background-color: #7692A3; height: 182px;">
                    <label for="username" style="color: White;">
                        Login ID</label>
                    <br />
                    <input type="text" tabindex="0" name="username" id="username" value="" onkeyup="keypressed()"
                        style="text-transform: uppercase;" /><br />
                    <label for="password" style="color: White;">
                        Password</label>
                    <br />
                    <input type="password" tabindex="0" name="password" id="password" value="" onkeyup="keypressed()" /><br />
                    <input type="image" src="asset/images/btnLogin.png" alt="Login" onmouseout="this.src='asset/images/btnLogin.png'"
                        onmouseover="this.src='asset/images/btnLogin_roll.png'" title="Login" /><br />
                    <br />
                    <span style="cursor: pointer; color: White;" onclick="window.open('<%=CandidateProfileMgr %>ForgetPassword.aspx', 'CandidateProfileMgr')">
                        Forgotten your password?</span>
                    <br />
                    <label for="lnkRegister" style="cursor: pointer; color: White;">
                        Register Now!</label><br />
                    <a id="lnkRegister" target="CandidateProfileMgr" href="<%=CandidateProfileMgr %>Signup.aspx">
                        <img src="asset/images/btnRegister.png" alt="Register" onmouseout="this.src='asset/images/btnRegister.png'"
                            onmouseover="this.src='asset/images/btnRegister_roll.png'" title="Register" /></a><br />
                </div>
            </div>
        </div>

        <script type="text/javascript">
            function logout(){
                if (confirm('Are you sure you want to logout ?')){
                    setTimeout("window.location.reload();", 1000);
                    return true;
                }
            }
        </script>

        <div id="divLoggedIn" style="display: none;" class="A05">
            <h3>
                <strong>Candidate Details</strong></h3>
            <div class="description" style="background-color: #7692A3; color: #FFFFFF;">
                Hi <span id="lblCandidateName"></span>,
                <br />
                You are currently logged in.<br />
                Click <a href="<%=CandidateProfileMgr %>Index.aspx" class="inLineLink" target="CandidateProfileMgr">
                    here</a> to access your profile or you can click <a href="<%=CandidateProfileMgr %>Logout.aspx"
                        class="inLineLink" target="CandidateProfileMgr" onclick="return logout();">here</a>
                to logout
            </div>
        </div>

        <script type="text/javascript" src="asset/js/jquery-1.2.6.pack.js"></script>

        <script type="text/javascript" src="asset/js/animatedcollapse.js">
        /***********************************************
        * Animated Collapsible DIV v2.0- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
        * This notice MUST stay intact for legal use
        * Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
        ***********************************************/
        </script>

        <script type="text/javascript">
            document.getElementById("divLoading").style.display="block";
            
            setTimeout("checkShown()", 5000);

            try{
                animatedcollapse.addDiv("divLoading", "fade=1,speed=150");
                animatedcollapse.addDiv("divLogin", "fade=1,speed=500");
                animatedcollapse.addDiv("divLoggedIn", "fade=1,speed=500");
                animatedcollapse.init();
            }
            catch(e){}
        </script>

        <%
            'Javascript Cross Side Scripting.
            'Purpose: Read Status of candidate to see the candidate is loggedinto the Candidate Profile Manager System
        %>
        <span id="xSiteScript"></span>

        <script type="text/javascript">
            
            function ParentShowHideLogin(val){
                gotResponse = true;
                setTimeout("PerformShowHide('" + val + "')", 0);
            }

            function writeName(val){
                <%'Use innerText instead of innerHTML to prevent cross site scripting(xss) %>
                document.getElementById("lblCandidateName").innerText = unescape(val);
            }

            function PerformShowHide(val){
                animatedcollapse.hide('divLoading');
                var loginDiv = document.getElementById("divLogin");

                if (loginDiv != null){
                    if (val.toLowerCase() == "block"){
                        animatedcollapse.hide('divLoggedIn');
                        animatedcollapse.show('divLogin');
                    }
                    else{
                        animatedcollapse.hide('divLogin');
                        animatedcollapse.show('divLoggedIn');
                    }
                }
            }

            function keypressed(){
                if(event.keyCode=='13'){
                    submitForm();
                }
            }

            function submitForm(){
                var eleUserName = document.getElementById("username");
                eleUserName.value = eleUserName.value.toUpperCase();

                document.loginForm.submit();

                //to refresh the window after the form submit, so as to get the status
                window.location.reload(true);
            }

            function validateForm(){
                if (document.getElementById("username").value == ""){
                    alert("Username cannot be empty");
                    document.getElementById("username").focus();
                    return false;
                }
                else if (document.getElementById("password").value == ""){
                    alert("Password cannot be empty");
                    document.getElementById("password").focus();
                    return false;
                }
                else{
                    submitForm();
                    return true;
                }
            }
            
            var ori_countdown = 10;
            var maxRetry = 5;
            
            var countdown = 20;
            var totalRetry = 0;
           
            function getStatus(){
                document.getElementById("xSiteScript").innerHTML = createHiddenFrame("<%=CandidateProfileMgr %>getStatus.aspx");
            }
            
            function checkShown(){
                if (document.getElementById("divLogin").style.display != "block"){
                    document.getElementById("txtLoading").innerHTML="Error connecting to server. Please try again later. Click <a target='_blank' href='<%=CandidateProfileMgr %>Login.aspx'>here</a> to access the candidate login screen directly";
                    totalRetry = totalRetry + 1;
                    retry();
                }
            }
            
            function retry(){
            
                if (totalRetry == maxRetry){
                    document.getElementById("txtLoading").innerHTML="Error connecting to server. Please try again later. Click <a target='_blank' href='<%=CandidateProfileMgr %>Login.aspx'>here</a> to access the candidate login screen directly";
                }
                else{
                    
                    if (countdown <= 0){
                        document.getElementById("txtLoading").innerHTML="Reconnecting to server (" + totalRetry + "). Click <a target='_blank' href='<%=CandidateProfileMgr %>Login.aspx'>here</a> to access the candidate login screen directly";
                        //getStatus();
                        setTimeout("checkShown()", 5000);
                        countdown = ori_countdown;
                    }
                    else{
                        countdown = countdown - 1;
                        document.getElementById("txtLoading").innerHTML="Retrying to connect to server in " + countdown + " seconds. Click <a target='_blank' href='<%=CandidateProfileMgr %>Login.aspx'>here</a> to access the candidate login screen directly";
                        setTimeout("retry()", 1000);
                    }
                }
            }
            getStatus();
            
        </script>

        <noscript>
            <div class="A05">
                <h3>
                    <strong>Candidate Login</strong></h3>
                <div class="description" style="background-color: #7692A3; height: 168px;">
                    <label for="username" style="color: White;">
                        Login ID</label>
                    <br />
                    <input type="text" tabindex="0" name="username" id="username" value="" style="text-transform: uppercase;" /><br />
                    <label for="password" style="color: White;">
                        Password</label>
                    <br />
                    <input type="password" tabindex="0" name="password" id="password" value="" /><br />
                    <input type="image" src="asset/images/btnLogin.png" alt="Login" onmouseout="this.src='asset/images/btnLogin.png'"
                        onmouseover="this.src='asset/images/btnLogin_roll.png'" title="Login" /><br />
                    <br />
                    <span style="cursor: pointer; color: White;" onclick="window.open('<%=CandidateProfileMgr %>ForgetPassword.aspx', 'CandidateProfileMgr')">
                        Forgotten your password?</span>
                    <br />
                    <label for="lnkRegister" style="cursor: pointer; color: White;">
                        Register Now!</label><br />
                    <a id="A1" target="CandidateProfileMgr" href="<%=CandidateProfileMgr %>Signup.aspx">
                        <img src="asset/images/btnRegister.png" alt="Register" onmouseout="this.src='asset/images/btnRegister.png'"
                            onmouseover="this.src='asset/images/btnRegister_roll.png'" title="Register" /></a><br />
                </div>
            </div>
        </noscript>
    </div>
</form>
